<template>
  <public-dialog
          title="提交《预算控制价》审批"
          :width="'35%'"
          v-model:visible="visible"
          confirm-button-title="提交"
          @onConfirm="onConfirm"
  >
    <el-form
            v-loading="isLoading"
            element-loading-text="数据提交中……"
            ref="formRef"
            :model="form"
            :rules="rules"
            label-width="150px">
        <el-row class="el-row">
            <el-col :span="24">
                <el-form-item label="所属项目-阶段-任务" >
                    <el-input disabled :placeholder="form.projectName+'-'+form.projectStageName+'-'+form.taskName"></el-input>
                </el-form-item>
            </el-col>
        </el-row>
        <el-row class="el-row">
          <el-col :span="24">
              <el-form-item label="项目预估价" prop="projectPrice">
                  <el-input v-model="form.projectPrice" @input="form.projectPrice=limitInputNum(form.projectPrice,10,3,true)" placeholder="请输入项目预估价"></el-input>
              </el-form-item>
          </el-col>
        </el-row>
        <el-row class="el-row">
            <el-col :span="24">
                <el-form-item label="预算控制价" prop="controlPrice">
                    <el-input v-model="form.controlPrice" @input="form.controlPrice=limitInputNum(form.controlPrice,10,3,true)" placeholder="请输入预算控制价"></el-input>
                </el-form-item>
            </el-col>
        </el-row>
        <el-row class="el-row">
            <el-col :span="24">
                <el-form-item label="预算控制价说明">
                    <el-input v-model="form.controlDesc"
                              :rows="5"
                              type="textarea"
                              placeholder="请输入预算控制价说明"></el-input>
                </el-form-item>
            </el-col>
        </el-row>
        <el-row class="el-row">
            <el-col :span="24">
                <el-form-item label="结果附件" prop="fileVos">
                    <FileMinioUpload
                            :restriction="true"
                            :restrictionLimit="9"
                            v-model:files="form.fileVos"
                    />
                </el-form-item>
            </el-col>
        </el-row>
    </el-form>
  </public-dialog>
</template>

<script setup>
import PublicDialog from "@/components/PublicDialog.vue";
import {reactive, ref} from "vue";
import {ElForm, ElFormItem, ElInput, ElRow, ElCol, ElMessage} from "element-plus";
import FileMinioUpload from "@/components/FileMinioUpload.vue";
import {limitInputNum, resetForm} from "@/common/utils/GlobalUtils";
import {projectTaskImplementation} from "@/api/taskImplementation";

const visible = ref(false);
const form = reactive({
    projectId:'',
    projectName:'',
    projectTaskId:'',
    itemId:'',
    projectPrice:'',
    controlPrice:'',
    controlDesc:'',
    fileVos:[]
});

const rules =  reactive({
    projectPrice: [{ required: true, message: '请输入项目预估价格', trigger: 'blur' }],
    controlPrice: [{ required: true, message: '请输入预算控制价格', trigger: 'blur' }],
    fileVos: [{ required: true, message: '请上传附件', trigger: 'change' }],
});

const formRef = ref(null);
const emits = defineEmits(['onSuccess']);

const isLoading = ref(false);
/**
 * 确认
 */
const onConfirm = () => {
    formRef.value.validate((valid, fields) => {
        if (valid) {
            isLoading.value = true;
            projectTaskImplementation.addProjectBudgetControlForm(form)
                .then(res=>{
                    if(res.code === '200'){
                        isLoading.value = false;
                        ElMessage.success('提交成功!');
                        closePopup();
                        emits('onSuccess');
                    }else{
                        isLoading.value = false;
                        ElMessage.error('提交失败!');
                        closePopup();
                        emits('onSuccess');
                    }
                })
        } else {
            console.log('error submit!', fields)
        }
    })
}

/**
 * 打开弹窗
 */
const openPopup = (params) => {
    visible.value = true;

    resetForm(form);
    for(let key in params){
        form[key] = params[key];
    }
}

/**
 * 关闭弹窗
 */
const closePopup = () => {
    visible.value = false;
}

defineExpose({openPopup,closePopup});
</script>

<style lang="scss" scoped>
.el-row{
  width: 100%;
}
</style>
